import React from "react";
import {register} from '../util/request/api'
class Home extends React.Component {
  constructor() {
    super();
    this.state = {
      registerForm: {
        phone: "",
        password: "",
        nickname:''
      },
    };
  }
  //获取登录表单的事件
  changeLogin(type, e) {
    this.setState({
      registerForm: {
        ...this.state.registerForm,
        [type]: e.target.value,
      },
    });
  }
  //封装一个登录事件
  /* 
  在登录的时候，我封装两个权限账号
  admin 123  它是VIP
  哈哈  123   它是普通会员
  vip 有权限看购物车
  普通会员没权限
  */
  login() {
    // if (
    //   this.state.registerForm.phone == "admin" &&
    //   this.state.registerForm.password == "123"
    // ) {
    //   //跳转到首页
    //   this.props.history.push("/index/home");
    //   //进行存储
    //   sessionStorage.setItem("isLogin", true);
    //   //当前是模拟：单独存储权限
    //   sessionStorage.setItem("type", 1);
    // } else if (
    //   this.state.registerForm.phone == "哈哈" &&
    //   this.state.registerForm.password == "123"
    // ) {
    //   //跳转到首页
    //   this.props.history.push("/index/home");
    //   //进行存储
    //   sessionStorage.setItem("isLogin", true);
    //   //当前是模拟：单独存储权限
    //   sessionStorage.setItem("type", 2);
    // } else {
    //   alert("请输入用户名 和密码");
    // }
    register(this.state.registerForm)
    .then(res=>{
      if(res.data.code==200){
        this.props.history.push("/");
      }else{
        alert(res.data.msg)
      }
    })
  }
  render() {
    return (
      <div>
        <h3>欢迎注册</h3>
        <div>
          昵称：
          <input
            type="text"
            onChange={this.changeLogin.bind(this, "nickname")}
          />
        </div>
        <div>
          用户名：
          <input type="text" onChange={this.changeLogin.bind(this, "phone")} />
        </div>
        <div>
          密码：
          <input
            type="text"
            onChange={this.changeLogin.bind(this, "password")}
          />
        </div>
        <div>
          <button onClick={this.login.bind(this)}>注册</button>
        </div>
      </div>
    );
  }
}
export default Home;
